import React, { useEffect, useState } from 'react'
import "./index.less";
// 详细期权数据 https://data.eastmoney.com/other/qqlhb.html
// 详细期货数据 https://data.eastmoney.com/IF/Data/Contract.html?va=IF
export const FarstLink = () => {
    const [courentIframeUrl, setCourentIframeUrl] = useState('https://data.eastmoney.com/other/qqlhb.html')
    const [intervalData, setInterData] = useState('')
    const urlsConig = [
        {
            name: '期权龙虎榜',
            url: 'https://data.eastmoney.com/other/qqlhb.html'
        },
        {
            name: '上证50',
            url: 'https://data.eastmoney.com/IF/Data/Contract.html?va=IH'
        },
        {
            name: '沪深300',
            url: 'https://data.eastmoney.com/IF/Data/Contract.html?va=IF'
        },
        {
            name: '中证500',
            url: 'https://data.eastmoney.com/IF/Data/Contract.html?va=IC'
        },
        {
            name: '中证1000',
            url: 'https://data.eastmoney.com/IF/Data/Contract.html?va=IM'
        },

    ]


    return <div >
        <div className='lableClass-wrapper'>
            {urlsConig.map(v => {
                return <div className={`lableClass ${v.url === courentIframeUrl ? 'active' : ''}`
                } onClick={() => {
                    setCourentIframeUrl(v.url)
                }}>{v.name}</div>
            })}</div>
        <iframe src={courentIframeUrl} className='courentIframeUrl'></iframe>
    </div>
}